<template>
    <div id="pdfNoPage">
        <div class="header">
            <div class="header-icon"
                 @click="goback">
                <md-icon
                        name="arrow-left"
                        size="lg"
                        style="font-weight:bold"></md-icon>
            </div>
            <div class="header-title">
                {{title}}
            </div>
        </div>
        <div class="div-pdf">
            <pdf
                    v-for="i in numPages"
                    :key="i"
                    :src="linkUrl"
                    :page="i">
            </pdf>
        </div>

    </div>
</template>
<script>

  import $common
    from '@/utils/common'
  import { Icon } from 'mand-mobile'
  import pdf
    from 'vue-pdf'

  export default {
    name : 'pdfNoPage' ,
    components : {
      pdf ,
      [ Icon.name ] : Icon
    } ,
    data () {
      return {
        //协议标题
        title : 'pdf不分页' ,
        numPages : 0 ,
        linkUrl : `${window.location.origin}/bxtk.pdf`  // pdf文件地址
        // linkUrl : `https://dat-m.95549.cn/bxtk1.pdf`  // pdf文件地址
      }
    } ,
    mounted () {
      console.log(window.location.origin)
      // https://m.95549.cn/resources/GHWX_6507/bxtk.pdf
      // 有时PDF文件地址会出现跨域的情况,这里最好处理一下
      // this.linkUrl = pdf.createLoadingTask('https://wap.95549.cn/resources/GHWX_6507/bxtk.pdf')

      //后面根据具体的页面处理
      // this.title = sessionStorage.getItem('title')
      // this.linkUrl = sessionStorage.getItem('linkUrl')
      // 有时PDF文件地址会出现跨域的情况,这里最好处理一下
      this.linkUrl = pdf.createLoadingTask ( this.linkUrl )
      this.linkUrl.promise.then ( pdf => {
        this.numPages = pdf.numPages
      } )

      $common.closeGlobalMask ()
    } ,
    methods : {
      stopFilter ( dataInfo ) {
        return new Promise ( function ( resolve , reject ) {
          setTimeout ( () => {
            console.log ( '本次录制的唯一编号' + dataInfo.taskId )
            console.log ( '是否正在录制中' + dataInfo.isBacktrackIng )
            console.log ( '所有上传的datainfo信息' , dataInfo.allDatas )
            resolve ( true )// 是否结束录制
          } , 2000 )
        } )
      } ,
      goback () {
        window.history.back ( -1 )
      } ,
    }
  }
</script>
<style lang="less"
       scoped>
    * {
        margin: 0;
        padding: 0;
    }

    .goback {
        position: fixed;
        width: 100vw;
        height: 0.5rem;
        padding-top: 0.1rem;
        background: #fff;
    }

    .goback img {
        display: block;
        width: 0.3rem;
        height: 0.3rem;
        margin-left: 0.2rem;
    }

    .goback p {
        font-size: 0.3rem;
        position: absolute;
        top: 0;
        left: 1rem;
        line-height: 0.65rem;
    }

    #pdfNoPage .iframes {
        width: 100%;
        height: 94vh;
        // margin-top: 0.6rem;
        background: #FFF;
    }

    .header {
        background-color: #eeeeee;
        right: 0;
        left: 0;
        // z-index: 10;
        height: 82px;
        padding-right: 50px;
        padding-left: 50px;
        display: flex;
        position: fixed;
        z-index: 100;
        // backface-visibility: hidden;
        .header-icon {
            font-size: 0.42rem;
            color: #cc3333;
            margin-left: -25px;
            line-height: 0.82rem;
        }

        .header-title {
            line-height: 0.82rem;
            margin: auto;
            font-size: 0.32rem;
        }
    }

    .div-pdf {
        padding-top: 80px;
    }

    .pdf-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        max-width: 1024px;
        width: 100%;
        margin: 0 auto;
        overflow-x: hidden;
        height: 100%;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        font-size: .28rem;

        span {
            width: 100%;
        }
    }
</style>
